<template>
	<button :disabled="disabled" :class="'xc_btn '+ type" hover-class="button-hover" @click="$emit('click')">{{name}}</button>
</template>

<script>
	export default {
		props:{
			name:{
				type:String,
				default:''
			},
			disabled:{
				type:Boolean,
				default:false
			},
			type:{
				type:String,
				default:'primary_btn'
			}
		}
	}
</script>

<style lang="scss">
	.xc_btn {
		height: 98upx;
		
		border-radius: $uni-border-radius;
		font-size:$uni-font-size-lg;
		font-family: SourceHanSansCN;
		letter-spacing: 8upx;
	}
	.primary_btn {
		background-image: $uni-linear-gradient-color-primary;
		color: #fff;
		box-shadow: $uni-btn-show-primary;
	}
	.primary_btn.button-hover {
		background-image:$uni-color-btn-hover !important;
	}
	
	.minor_btn {
		background-image: none;
		color: #999999;
		box-shadow:none;
		background-color: #fff;
	}
	.minor_btn:after {
		border:2upx solid #999999;
	}
	.minor_btn.button-hover {
		background-color: #f7f4f4;
	}
</style>
